<template>
  <div class="hello">
    <van-index-bar>
      <van-index-anchor index="A" />
      <van-pull-refresh v-model="refreshing"  @refresh="onRefresh">
        <van-list
                v-model:loading="loading"
                :finished="finished"
                finished-text="没有更多了"
                @load="onLoadlist"
        >
          <van-cell v-for="item in list" :key="item" :title="item" />
          <van-back-top />
        </van-list>

      </van-pull-refresh>
    </van-index-bar>
  </div>
</template>

<script>
  // 1. 引入你需要的组件
  import {List, Cell, PullRefresh, NoticeBar ,BackTop } from 'vant';
  // 2. 引入组件样式
  import 'vant/lib/index.css';

  import axios from "axios";



export default {
  name: 'HelloWorld',
  props: {
    msg: String,
  },
  data() {
    return {
      page: 0,
      limit: 10,
      list: [],
      loading: false,
      finished: false,
      refreshing: false,
    }
  },
  methods: {
    onLoadlist() {
      console.log(111)
      var data={
        prjid:sessionStorage.getItem('prjid'),
        id:this.$route.query['id'],
        page:this.page++
      }
      axios.post('http://bs.bzjsgl.cn/admin/getdata/getPrjAlerts',{data})
              .then(res => {
                var newList = res.data['data']
                if (res.data['code'] === 20000) {
                  if (this.refreshing) {
                    this.list = [];
                    this.refreshing = false;
                  }
                  for (let i = 0; i < newList.length; i++) {
                    this.list.push(newList[i]['illustration']);
                  }
                  this.loading = false;
                  if(newList.length == 0) {
                    this.finished = true;
                  }
                }
              })
              .catch(function (error) { // 请求失败处理
                console.log(error)
              })
    },
    onRefresh() {
      // 清空列表数据
     // this.finished = false;
      // 重新加载数据
      // 将 loading 设置为 true，表示处于加载状态
      this.loading = true;
      this.page = 0
      console.log(1144441)
      this.onLoadlist();
    },
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  components: {
    [List.name]: List,
    [Cell.name]: Cell,
    [PullRefresh.name]:PullRefresh,
    [NoticeBar .name]:NoticeBar,
    [BackTop .name]:BackTop
  },


}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
